/* eslint-disable no-unused-vars */
const slider = document.querySelector('.slider');
const slides = Array.from(document.querySelectorAll('.slide'));
const dotsContainer = document.querySelector('.dots');
let currentSlide = 0;

slides.forEach((slide, index) => {
    const dot = document.createElement('span');
    dot.classList.add('dot');
    dotsContainer.appendChild(dot);

    dot.addEventListener('click', () => {
        currentSlide = index;
        showSlide(currentSlide);
    });
});

function showSlide(n) {
    // 隐藏所有幻灯片
    slides.forEach((slide) => slide.classList.remove('active', 'prev', 'next'));

    // 显示当前幻灯片和指示点
    slides[n].classList.add('active');
    dotsContainer.children[n].classList.add('active');

    // 显示前一个和下一个幻灯片
    if (n === 0) {
        slides[slides.length - 1].classList.add('prev');
        dotsContainer.children[slides.length - 1].classList.remove('active');
        slides[n + 1].classList.add('next');
        dotsContainer.children[n + 1].classList.remove('active');
    } else if (n === slides.length - 1) {
        slides[n - 1].classList.add('prev');
        dotsContainer.children[n - 1].classList.remove('active');
        slides[0].classList.add('next');
        dotsContainer.children[0].classList.remove('active');
    } else {
        slides[n - 1].classList.add('prev');
        dotsContainer.children[n - 1].classList.remove('active');
        slides[n + 1].classList.add('next');
        dotsContainer.children[n + 1].classList.remove('active');
    }
}

function nextSlide() {
    currentSlide++;
    if (currentSlide >= slides.length) {
        currentSlide = 0;
    }
    showSlide(currentSlide);
}

setInterval(nextSlide, 5000); // 每5秒切换到下一张幻灯片

showSlide(currentSlide); // 显示第一张幻灯片和指示点
